<template>
	<view>
		<block v-if="isShare">
			<cu-custom bgColor="bg-blue" isCustom>
				<view slot="content">{{title}}</view>
			</cu-custom>
		</block>
		<block wx:else>
			<cu-custom bgColor="bg-blue" isBack>
				<view slot="content">{{title}}</view>
			</cu-custom>
		</block>
		<!-- <wxs module="common" src="../../../utils/common.wxs"></wxs> -->

		<view class="flex bg-white">
			<view class="flex flex-treble nav text-center">
				<view :class="'cu-item flex-sub'+(index==current?'text-blue cur':'')" v-for="(item,index) in tabList" 
					@tap="tabSelect" :key="index" :data-id="index">
					item
				</view>
			</view>
			<view class="flex-sub text-center text-blue" style='line-height:90rpx'>
				<picker :range="provinceList" range-key="name" @change="bindPickerChange">
					<view class="picker">
						{{attenCity}} <text class='fa fa-angle-down'></text>
					</view>
				</picker>
			</view>
		</view>
		<scroll-view scroll-y :style="'height:calc(100vh - '+statusBarHeight+'+45px'" @touchstart='touchStart'
			@touchend='touchEnd' @touchmove='touchMove' @scrolltolower="lower">
			<refresh v-if="showRefresh" :status='freshStatus'></refresh>
			<view class="cu-card article" v-for="(item, index) in list"  @tap="detail" :data-item="item">
				<view class="cu-item shadow padding-top" style="margin:8rpx 20rpx;padding-bottom: 0;">
					<view class="content flex" style="padding-bottom:10px;">
						<view class='flex-sub'>
							<image class='radius bg-gray' lazy-load :src="item.homePicPath" mode="aspectFill"
								style='height:22vw;width:22vw'></image>
						</view>

						<view class="flex-treble padding-left">
							<view class="text-content">
								<view style='width:60vw' class="text-bold text-black text-cut text-lg padding-top-xs">
									{{item.businessName}}</view>
								<view style='width:60vw' class='text-cut padding-top-xs'>
									<text class="fa fa-map-marker"></text> item.businessAddress
								</view>
							</view>
							<view class='flex'>
								<view class="flex-sub text-grey text-sm">人气 : {{item.businessHits}}</view>
								<view class="flex-sub text-grey text-sm">距离 : {{item.distance?item.distance:'--'}} km
								</view>
							</view>
						</view>
					</view>
					<view v-if="item.bussAd" style="width:100%" class='noticebar'>{{item.bussAd}}</view>
				</view>
			</view>
			<!-- <load :status='pullStatus' v-if="!showRefresh"></load> -->
		</scroll-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				statusBarHeight: 45,//app.globalData.CustomBar,
				tabList: ['推荐', '最新', '附近'],
				current: 0,
				pullStatus: 'loading',
				queryData: {
					currPage: 1,
					orderType: 0
				},
				attenCity: '省份',
				list: [],
				userID: '',
				isShare: false,
				provinceList: util.provinceList,
				shareTitle: '异地调车，就上租巴界！'
			}
		},
		onLoad(options) {
			// 获取位置
			/*let location = util.location();
			     let queryData = this.data.queryData;
			     queryData.businessType = options.id;
			     if(options.id == 9){
			       this.setData({
			         shareTitle: '招人找工作，就上租巴界！'
			       })
			     }
			 
			     if (location.latitude) {
			       queryData.latitude = location.latitude;
			       queryData.longitude = location.longitude;
			     }
			     this.setData({
			       title: decodeURIComponent(options.name),
			       queryData
			     }, ()=>{
			       this.getList();
			     })
			 
			     if(options.scene && options.scene !== ''){
			       uni.setStorageSync('inviterId', options.scen)
			       this.setData({
			         isShare: true
			       })
			     }
			 
			     let userInfo = uni.getStorageSync('userInfo');
			     if(userInfo){
			       this.setData({
			         userID: userInfo.userID
			       })
			     }*/
		},
		onShow() {

		},
		methods: {
			  //
			  getList(type) {
			    let _this = this;
			    this.baseRequest('api/business/page', 'GET', this.data.queryData, function (res) {
			      let list = [];
			      if (res && typeof (res) != 'string') {
			        list = res;
			        _this.setData({
			          pullStatus: 'loaded'
			        });
			      } else {
			        _this.setData({
			          pullStatus: 'nomore'
			        });
			      }
			      uni.hideLoading();
			      // 判断是否为上拉加载
			      if (type == 'pull') {
			        list = _this.data.list.concat(list);
			      }
			      _this.setData({
			        showRefresh: false,
			        list
			      })
			    });
			  },
			  bindPickerChange(e){
			    let item = this.data.provinceList[parseInt(e.detail.value)]
			    let queryData = this.data.queryData;
			    queryData.provinceCode = item.code;
			    queryData.currPage = 1;
			    this.setData({
			      attenCity: item.name,
			      queryData,
			      pullStatus: 'loading',
			      list: [],
			      cityopen: false
			    }, () => {
			      this.getList(); // 查询列表
			    })
			  },
			
			  // 导航选择
			  tabSelect(e) {
			    let current = e.currentTarget.dataset.id;
			    if (current == this.data.current) {
			      return;
			    }
			
			    let queryData = this.data.queryData;
			    queryData.currPage = 1;
			    queryData.orderType = 0;
			    if (current == 2){
			      queryData.orderType = 1; // 距离最近
			    }
			    this.setData({
			      queryData,
			      current,
			      pullStatus: 'loading',
			      list: []
			    }, () => {
			      this.getList();
			    })
			  },
			  // 拨打电话
			  phoneCall(e) {
			    util.phoneCall(e.currentTarget.dataset.phone);
			  },
			
			  // 上拉加载
			  lower() {
			    if (this.data.pullStatus != 'loaded') {
			      return;
			    }
			
			    this.setData({
			      pullStatus: 'loading'
			    });
			
			    let queryData = this.data.queryData;
			    queryData.currPage += 1;
			    this.setData({
			      queryData
			    }, () => {
			      this.getList('pull');
			    })
			  },
			  // 详情
			  detail(e) {
			    let item = e.currentTarget.dataset.item;
			    uni.navigateTo({
			      url: '/pages/cars/detail/detail?businessID=' + item.businessID + '&distance=' + item.distance
			    })
			  },
			  // 触摸开始位置
			  touchStart(e) {
			    this.setData({
			      startY: e.changedTouches[0].pageY,
			      freshStatus: 'more'
			    })
			  },
			  // 
			  touchMove(e) {
			    if (this.data.pullStatus == 'loading') {
			      return;
			    }
			    let endY = e.changedTouches[0].pageY;
			    let startY = this.data.startY;
			    let dis = endY - startY;
			    // 判断是否下拉
			    if (dis <= 0) {
			      return;
			    }
			    let offsetTop = e.currentTarget.offsetTop;
			    if (dis > 20) {
			      this.setData({
			        showRefresh: true
			      }, () => {
			        if (dis > 50) {
			          this.setData({
			            freshStatus: 'end'
			          })
			        } else {
			          this.setData({
			            freshStatus: 'more'
			          })
			        }
			      })
			    } else {
			      this.setData({
			        showRefresh: false
			      })
			    }
			  },
			  // 触摸结束位置
			  touchEnd(e) {
			    if (this.data.freshStatus == 'end') {
			      let queryData = this.data.queryData;
			      queryData.currPage = 1;
			      this.setData({
			        freshStatus: 'fresh',
			        queryData
			      }, ()=>{
			        this.getList(); // 查询列表
			      })
			    } else {
			      this.setData({
			        showRefresh: false
			      })
			    }
			  }
		}
	}
</script>

<style>

</style>